<template>
	<view class="content">
		<view class="center">
			<view class="title">{{list.serviceName}}</view>
			<view class="msg">
				<text class="nam">{{list.userName}}</text>
				<text class="sex">{{list.sex}}</text>
				<text class="age">{{list.age}}</text>
			</view>
			<view class="time">
				<text>{{list.createdAt}}</text>
			</view>
		</view>
		<view class="center">
			<view class="title">患者主述</view>
			<view class="desc  line2">
				{{list.principleAction}}
			</view>
		</view>
		<view class="center" style="padding: 32rpx 40rpx 0 40rpx;">
			<view class="title">体征检查</view>
			<view class="sign">
				<text class="title">体温</text>
				<text class="unit">（摄氏度）</text>
				<text>：</text>
				<text class="msg">{{list.animalHeat}}</text>
			</view>
			<view class="sign">
				<text class="title">脉搏</text>
				<text class="unit">（次/分）</text>
				<text>：</text>
				<text class="msg">{{list.sphygmus}}</text>
			</view>
			<view class="sign">
				<text class="title">呼吸</text>
				<text class="unit">（次/分）</text>
				<text>：</text>
				<text class="msg">{{list.breathe}}</text>
			</view>
			<view class="sign" style="border-bottom: none;">
				<text class="title">血压</text>
				<text class="unit">（mmHg）</text>
				<text>：</text>
				<text class="msg">{{list.bloodPressure}}</text>
			</view>
		</view>
		<view class="center">
			<view class="title">护理记录</view>
			<view class="samllTitle" v-if="photo.length>0">护理图片</view>
			<view class="" style="display: flex;justify-content: flex-start;" v-if="photo.length>0">
				<image v-for="(item,index) in photo" :src="item" :key="index" mode="aspectFit" @click="clickImg(index)"
					style="width: 212rpx;height: 136rpx;margin-top: 24rpx;background: rgba(243, 246, 246, 1);border-radius: 20rpx;margin-right: 20rpx;">
				</image>
			</view>
			<view class="samllTitle">护理内容</view>
			<view class="desc line2">
				{{list.nursingContent}}
			</view>
		</view>
		<view class="center">
			<view class="title">健康指导</view>
			<view class="desc  line2">
				{{list.healthGuidance}}
			</view>
		</view>
	</view>
</template>

<script>
	import {
		selectNursingRecordById
	} from '@/apis/nurse-report/index.js'
	export default {
		data() {
			return {
				id: '',
				list: {
					serveName: '',
					healthGuidance: ''
				},
				photo: '',
			}
		},
		onLoad(option) {
			console.log('11122222', option.id)
			this.id = option.id
		},
		onShow() {
			this.get()
		},
		// mounted:function(){
		// 	this.$nextTick(function(){
		// 		this.get()
		// 	})
		// },
		methods: {
			async get() {
				let id = this.id
				let res = await selectNursingRecordById({
					id
				})
				if (res.success) {
					for (let key in res.object) {
						if (!res.object[key]) {
							res.object[key] = '未填写'
						}
					}
					this.list = res.object
					if (res.object.staPictureUrl && res.object.endPictureUrl) {
						let arr = res.object.staPictureUrl.split(',')
						this.photo = [...arr]
					}
					console.log('res', this.list)
 
				}
			},
			//图片预览
			clickImg(index) {
				let _this = this
				wx.previewImage({
					urls: _this.photo,
					current: _this.photo[index], // 当前显示图片的http链接，默认是第一个
					success: function(res) {},
					fail: function(res) {},
					complete: function(res) {},
				})
			},
		}
	}
</script>

<style lang="scss" scoped>
	.content {
		min-height: 100vh;
		background: rgba(243, 246, 246, 1);
		padding-top: 16rpx;
		box-sizing: border-box;
	}

	.center {
		background-color: #FFFFFF;
		width: 100%;
		// height: 242rpx;
		padding: 32rpx 40rpx;
		// border-top: 1rpx solid rgba(0, 0, 0, 0.1);
		display: flex;
		flex-direction: column;
		justify-content: space-between;
		box-sizing: border-box;
		margin-bottom: 16rpx;
		font-family: PingFangSC-Medium, PingFang SC;
		font-weight: 500;
		color: #666666;

		.title {
			height: 50rpx;
			font-size: 36rpx;
			line-height: 50rpx;
			font-size: 36rpx;
			font-weight: 500;
			color: #333333;
		}

		.samllTitle {
			height: 40rpx;
			font-size: 28rpx;
			line-height: 40rpx;
			margin-top: 24rpx;
			color: #333333;
		}

		.msg {
			height: 60rpx;
			height: 60rpx;
			line-height: 60rpx;
			font-size: 28rpx;
			line-height: 60rpx;

			text {
				margin-right: 24rpx;
			}
		}

		.time {
			height: 40rpx;
			font-size: 28rpx;
			line-height: 40rpx;

			text {
				margin-right: 8rpx;
			}
		}

		.desc {
			width: 672rpx;
			font-size: 28rpx;
			line-height: 40rpx;
			margin-top: 24rpx;

		}

		.sign {
			width: 670rpx;
			height: 108rpx;
			// border-bottom:1rpx solid rgba(0, 0, 0, 0.1);
			display: flex;
			align-items: center;

			text {
				// margin-right: 10rpx;
				display: block;
				font-size: 32rpx;
				font-family: PingFangSC-Regular, PingFang SC;
				font-weight: 400;
				color: #333333;
			}

			.msg {
				color: #666666;
			}
		}
	}
</style>